﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Exemplo JavaScript</title>
</head>
<body>
    <div style="width: 500px; height: 250px; margin-left: 400px; margin-top: 100px; font-family: Arial;
        font-size: 15px; text-align: justify; color: #000;">
        <center>
            <h1>
                Exemplo JavaScript</h1>
        </center><br /><br />Função onde o cliente clica em um botão e é executada uma função.
        <textarea style="width: 500px; height: 200px;" disabled="disabled" rows="" cols="">
        <script>
            function clica() {
                document.getElementById("texto").innerHTML = "Voce clicou no botao!";
            }
</script>
 
<input type=button onClick="clica();" value="Enviar">
<div id="texto"></div>
</textarea><br /><br />Função de quando clicar em algum botao mostra uma janela<br /><br />
        <textarea style="width: 500px; height: 300px;" disabled="disabled" rows="" cols="">
        function showWin(url, args, js, fn) {
    Ext.addJs(js, function () {
        Ext.getAjax('ajxWin').callback({
            url: url,
            args: args,
            fn: function (rs) {
                var win = Ext.createObj(rs["win"]);
                win.url = url;
                win.show();
                if (fn != null)
                    fn(rs);
            }
        });
    });
}
</textarea><br /><br />Salvar as informações escritas na janela<br /><br />
<textarea style="width: 500px; height: 400px;" disabled="disabled" rows="" cols="">
 function saveWin(idWin, url) {
    var win = $cmp(idWin);
    if (!win.validate())
        return;
    var values = getWinValues(win);
    var fn = function (rs) {
        if (rs.msg != undefined) {
            Ext.MessageBox.alert(rs["title"], rs["msg"]);
            if (rs["result"] != "noConfirm" && rs["result"] != "noEquals") 
                win.close();
            return;
        }
        win.close();
        loadData();
        if (win.onSave)
            win.onSave(rs);
    };
    Ext.getAjax('ajxSave').callback({ args: values, url: url, fn: fn });

}

</textarea><br /><br />Função de fechar a janela/<br /><br />
<textarea style="width: 500px; height: 100px;" disabled="disabled" rows="" cols="">
 function closeWin(w) {
    w.ownerCt.ownerCt.close();
}

</textarea><br /><br />Remove um itempelo ID/<br /><br />
<textarea style="width: 500px; height: 300px;" disabled="disabled" rows="" cols="">
function removeItem(id) {
    var titulo = String.format("Deseja realmente remover o item selecionado?")
    Ext.MessageBox.confirm("Remover", titulo, function (btn) {
        if (btn == 'yes') {
            Ext.getAjax("ajxRemove").callback({
                args: { idToRemove: id },
                fn: function (rs) {
                    if (rs.msg != undefined)
                        $alert(rs.titulo, rs.msg);
                    else
                        loadData(id);
                }
            });
        }
    });
}

</textarea><br /><br />Efetuar Logoff do sistema<br /><br />
<textarea style="width: 500px; height: 200px;" disabled="disabled" rows="" cols="">
function logOff() {
    Ext.getAjax("ajxLogOff").callback({
        fn: function (rs) {
            if (rs['msg']) {
                Ext.MessageBox.Alert("Error");
            }
            window.location = rs["redirect"];
        }
    });
}
</textarea><br /><br />Editar uma Janela (Exemplo com o do usuario)<br /><br />
<textarea style="width: 500px; height: 150px;" disabled="disabled" rows="" cols="">
function editarUsuario() {
    var id = $('hfIdUsuarioLogado').value;
    showWin('/Pages/Fields/CEditarUsuario.aspx', { Id: id }, '/Pages/Fields/Add/Js/CEditarUsuario.js', null);
}}
</textarea><br /><br />Pegar um ID ao clicar numa Grid<br /><br />
<textarea style="width: 500px; height: 150px;" disabled="disabled" rows="" cols="">
function getId() {
    if ($cmp("grd") != undefined)
        var key = $cmp("grd").getSelectedKey();
    if (!key) return 0;
    return key[0];
}
</textarea><br /><br />Pegar mais de um Id quando a Grid disponibiliza selecionar varios.<br /><br />
<textarea style="width: 500px; height: 200px;" disabled="disabled" rows="" cols="">
function getIds() {
    var ids = [];
    if ($cmp('grd') != undefined)
        Ext.each($cmp('grd').getSelectedKeys(), function (d) { ids[ids.length] = d[0] });
    return ids;
}
</textarea><br /><br />Fazer um filtro na Grid.<br /><br />
<textarea style="width: 500px; height: 700px;" disabled="disabled" rows="" cols="">
function filter(v, idGrd) {
    if (!Ext.isString(idGrd)) { idGrd = "grd"; }

    var fn = function (v) {
        if (v == null || v == undefined)
            return "";
        if (typeof (v) == "string")
            return v.toUpperCase().replace(/[ÀÂÄÁÃ]/g, "A").replace(/[ÈÊËÉ]/g, "E").replace(/[ÌÎÏÍ]/g, "I").replace(/[ÒÔÖÓÕ]/g, "O").replace(/[ÙÛÜÚ]/g, "U").replace(/Ç/g, "C").replace(/\\/g, "\\\\");
        if (v instanceof Date)
            return v.dateFormat('d/m/Y H:i');
        return v.toString();
    };
    v = fn(v);
    var grd = $cmp(idGrd);
    grd.body.mask('Filtrando...', "x-mask-loading");
    grd.store.filterBy(function (record) {
        var keys = record.fields.keys
        var values = v.split(' ');
        for (var x = 0; x < keys.length; x++) {
            if (keys[x].match(/\S*Id$/))
                continue;
            var f = fn(record.get(keys[x]));
            if (f.length == 0)
                continue;
            for (var y = 0; y < values.length; y++)
                if (f.match(values[y]))
                    values.remove(values[y--]);
            if (values.length == 0)
                return true;
        }
        return false;
    });
    grd.body.unmask();
}

</textarea><br /><br />Limpar campo de filtro.<br /><br />
<textarea style="width: 500px; height: 150px;" disabled="disabled" rows="" cols="">
function clearSearch(t) {
    if (!t) return;
    t.reset();
    if (t.triggers)
        t.triggers[0].hide();
    $cmp('grd').store.clearFilter();
}
</textarea><br /><br />Carrega valores da grid.<br /><br />
<textarea style="width: 500px; height: 200px;" disabled="disabled" rows="" cols="">
function loadData(fn) {
    if (!Ext.isFunction(fn)) { fn = function fn() { enableGridButtons(); }; }
    $cmp("grd").callback({ args: getSearchArgs(), fn: fn });
}

</textarea><br /><br />Pega o argumento no campo pesquisa.<br /><br />
<textarea style="width: 500px; height: 200px;" disabled="disabled" rows="" cols="">
function getSearchArgs() {
    var chk = $('chkSearch');
    if (!chk || !chk.checked)
        return;
    var obj = getWinValues($cmp('tip'));
    obj.isSearch = true;
    if ($cmp("txtSearch") != undefined)
        obj.valueSearch = $cmp("txtSearch").getValue();
    return obj;
}
</textarea><br /><br />Habilita e desabilita alguns botoes da grid dependendo da sua permissão.<br /><br />
<textarea style="width: 500px; height: 250px;" disabled="disabled" rows="" cols="">
function enableGridButtons() {  
    var selecteds = $cmp("grd").getSelectedKeys().length;
    if (selecteds == 1) {
        if ($cmp("btnRelatorio") != undefined) {
            $cmp("btnRelatorio").setDisabled(false);
        }
    } else {
        if ($cmp("btnRelatorio") != undefined) {
            $cmp("btnRelatorio").setDisabled(true);
        }
      
    }
}

</textarea><br /><br />Remove um item do sistema pelo ID passado pela Grid.<br /><br />
<textarea style="width: 500px; height: 150px;" disabled="disabled" rows="" cols="">
function remove() {
    if (Ext.getCmp("grd") != undefined) {
        var id = Ext.getCmp("grd").selModel.selections.items[0].data.Id;
        removeItem(id);
    }
}

</textarea><br /><br />Faz uma busca escondida (callback) pegando o item na posição selecionada na Grid.<br /><br />
<textarea style="width: 500px; height: 300px;" disabled="disabled" rows="" cols="">
function callbackItemPosition(args, grd) {
    var selected = grd.getSelectedKey();
    if (selected != undefined) {
        var fn = function () {
            var rows = grd.getKeys();
            for (i in rows) {
                if (typeof (rows[i]) != 'object' || rows[i][0] != selected[0])
                    continue;
                grd.selModel.selectRow(i);
                grd.view.focusRow(parseInt(i));
                break;
            }
        };
        grd.callback({ "args": args, "fn": fn });
    }
    else
        grd.callback({ "args": args });
}

</textarea><br /><br />Verifica a seleção do usuario pela Grid.<br /><br />
<textarea style="width: 500px; height: 150px;" disabled="disabled" rows="" cols="">
function verificarSelecao() {
    if (!Ext.getCmp("chkAtivos").checked && !Ext.getCmp("chkInativos").checked)
        Ext.getCmp("chkAtivos").setValue(true);

}

</textarea><br /><br />Habilita os dados selecionado na grid.<br /><br />
<textarea style="width: 500px; height: 150px;" disabled="disabled" rows="" cols="">
function enableDates() {
    Ext.getCmp("dtpSearchDate1").setDisabled(!Ext.getCmp("chkBetweenDates").checked);
    Ext.getCmp("dtpSearchDate2").setDisabled(!Ext.getCmp("chkBetweenDates").checked);
}
</textarea><br /><br />Redireciona para uma pagina ao clicar em um link<br /><br />
<textarea style="width: 500px; height: 150px;" disabled="disabled" rows="" cols="">
function redirecionarViagem() {
    location.href = "/Pages/GVisita.aspx";
}
</textarea><br /><br />Função para formatar uma data<br /><br />
<textarea style="width: 500px; height: 150px;" disabled="disabled" rows="" cols="">
function formatarData(value) {
    var data = value != null ? value.format("d/m/Y") : value;
    return data;
}
</textarea><br /><br />Redirecionamento de pagina em Callback, passando as informações para a outra e fazendo uma verificação de erro<br /><br />
<textarea style="width: 500px; height: 180px;" disabled="disabled" rows="" cols="">
function redirecionarGasto() {
    Ext.getAjax("ajxRedirect").callback({ args: { idVisita: Ext.getCmp("grd").selModel.selections.items[0].data.Id },
        fn: function (rs) {
            if (rs['msg']) {
                Ext.MessageBox.Alert("Error");
            }
            window.location = "/Pages/GGasto.aspx";
        }
    });
}

</textarea><br /><br />Função para chamar um arquivo MRT(Relatorios)<br /><br />
<textarea style="width: 500px; height: 300px;" disabled="disabled" rows="" cols="">
function visualizarRelatorio(value) {
    var filename = "Viagem.mrt";
    var id = Ext.getCmp("grd").selModel.selections.items[0].data.Id;
    if (filename != undefined) {
        var width = screen.availWidth - 100;
        var height = screen.availHeight - 100;
        var top = (screen.availHeight / 2) - (height / 2);
        var left = (screen.availWidth / 2)
        var page = "/Relatorio/VisualizarRelatorio.aspx?id_visita=" + id + "&relatorio=" + filename + "&height=" + (height - 5) + "&width=" + (width - 5);
        window.open(page, "_blank", "height=" + height + ", width=" + width + ", top=" + top + ", left=" + left + ", toolbar=false, scrollbars=no");
    }
}
</textarea>
        <br />
        <br />
        <a href="TutoJavaScript.htm">Voltar a Página Anterior</a>
    </div>
</body>
</html>
